<template>
    <div class="content">
        <h3 class="user-title">{{'WECHAT'|t}}</h3>
        <div class="form">
            <zx-form-group :title="$t('WECHAT')">
                <zx-input v-model="phoneForm.account" type="text" :place="$t('WECHAT_PLACE')" ref="account" :rules='rules.account'>
                </zx-input>
            </zx-form-group>
            <zx-form-group :title="$t('USER_TRADE')">
                <zx-input v-model="phoneForm.password" type="password" :place="$t('USER_TRADE_PASS_PLACE')" ref="password" :rules='rules.password'>
                </zx-input>
            </zx-form-group>
            <zx-form-group>
                <input type="button" class="submit-btn mt-20 green-btn radius" :value="$t('IMMEDIATELY_BINGDING')" @click="submitForm('phoneForm')">
            </zx-form-group>
        </div>
    </div>
</template>
<script>
    import { Form, Func, Auth, Rules } from '@/providers';
    import { User, UserInfo } from '@/services';
    export default {
        data() {
            return {
                name: '',
                phoneForm: {
                    account: '',
                    password: ''
                },
                rules: Rules
            };
        },
        methods: {
            // 表单提交
            async submitForm(formName) {
                if (!Form.validataForm(this, formName)) {
                    return false;
                }
                let _parmas = this[formName];
                try {
                    let res = await User.BindWeChat({
                        weixin: _parmas.account,
                        dealPassword: Func.PasswordEncrypt(_parmas.password),
                        token: Auth.getItem('token')
                    });
                    this.$dialog.toast({
                        msg: res.desc,
                        position: 'top',
                        onOk: () => {
                            this.$store.dispatch('GETUSERTATUS');
                        }
                    });
                } catch (error) {
                    console.log(error);
                }
            }
        }
    };
</script>
<style scoped lang="scss">
    @import "../../assets/sass/user.scss";
</style>